<!DOCTYPE html>
<html>
<head>
    <title>全景图</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript"
            src="http://api.map.baidu.com/api?v=2.0&ak=4qXTGvclMqTZXkLsU3twnMA7">
    </script>
    <style type="text/css">
        body, html{
            width: 100%;
            height: 100%;
            overflow: hidden;
            margin:0;
            font-family:"微软雅黑";
        }
        #panorama {
            height: 100%;
            width: 100%;
            overflow: hidden;
        }

    </style>
</head>
<body>
<div id="panorama"></div>

<script type="text/javascript">

    var jd="116.349902";
    var wd="40.065817";
    //全景图展示
    var panorama = new BMap.Panorama('panorama');
    panorama.setPosition(new BMap.Point(jd, wd)); //根据经纬度坐标展示全景图
    panorama.setPov({heading: -40, pitch: 6});
    //全景图位置改变后，普通地图中心点也随之改变
    panorama.addEventListener('position_changed', function(e){
        var pos = panorama.getPosition();
        map.setCenter(new BMap.Point(pos.lng, pos.lat));
        marker.setPosition(pos);
    });
</script>
</body>
</html>
